葛rif<template>
    <div class="comp-verify-code">
        <a href="javascript:;" class="ui-btn ui-btn--gray ui-btn--block"
           @click="getCode"
           v-if="isLoading===false"
           :disabled="codeLock">{{codeBtnText}}</a>
        <a href="javascript:;" class="ui-btn ui-btn--gray ui-btn--block"
           @click="getCode"
           v-if="isLoading===true"
           disabled>{{$t('common.waiting')}}...</a>
    </div>
</template>

<script type="text/babel">

    import commonService from '../common/commonService';

    export default {
        props: {
            onClick: {
                type: Function,
                default: null
            },
            onSuccess: {
                type: Function,
                default: null
            },
            onFail: {
                type: Function,
                default: null
            }
        },
        data() {
            return {
                codeBtnText: this.$t('common.sendEmail'),
                codeLock: false,
                isLoading:false
            };
        },
        methods: {

            getCode(){
                let that = this;
                let loopTimeId = null;
                let count = 60;

                if (typeof this.onClick === 'function') {
                    this.onClick();
                }
                // 从window.app.user.value中获取用户信息
                //登录后发送验证码不需要手机号信息

                this.isLoading = true;
                commonService.sendCode({
                    sendType: 'EMAIL',
                    sendAccount: window.localStorage.getItem('account-no')
                }).done((rep) => {
                    if (rep.code == window.CODE.SUCCESS) {
                        this.codeLock = true;//获取验证码锁定 true：正在获取验证码，不可点击   false：可以点击
                        send();
                        if (typeof this.onSuccess === 'function') {
                            this.onSuccess(rep);
                        }
                        loopTimeId = setInterval(function () {
                            send();
                        }, 1000);
                    } else {
                        if (typeof this.onFail === 'function') {
                            this.onFail(rep);
                        }
                    }
                }).fail((rep) => {
                    this.onFail(rep);
                }).always(()=>{
                    this.isLoading = false;
                });

                function send() {
                    if (count > 0) {
                        if(that.$i18n){
                            that.codeBtnText = count + that.$t('common.secondUnit');
                        }else{
                            that.codeBtnText = count + 's';
                        }
                        count--;
                    } else {
                        clearInterval(loopTimeId);
                        that.codeBtnText = that.$t('common.retryVerifyCode');
                        that.codeLock = false;
                    }
                }

            }
        }
    }
</script>

<style lang="sass" rel="stylesheet/scss">
    .comp-verify-code {
        display: inline-block;
        vertical-align: middle;
        font-size: 12px;
        .ui-btn {
            padding: 0;
            font-size: 12px;
            height: 32px;
            line-height: 32px;
        }
    }
</style>